import { FC, useEffect } from "react";
import { observer, inject } from "mobx-react";
import { useRoutes, useLocation, useNavigate } from "react-router-dom";
import router, { settingRRouter } from "./router";
import { ITStore } from "./store";
import "./app.less";

type TProp = {
  store: ITStore;
};

const App: FC<TProp | any> = ({ store }: TProp) => {
  const {
    userStore: { getUserInfo },
  } = store;

  const navigate = useNavigate();
  let location = useLocation();

  useEffect(() => {
    const { pathname } = location;
    if (pathname === "/") {
      navigate("/designer");
    }
  }, [location, navigate]);

  const userInfo = getUserInfo();
  const { privilege } = userInfo || {};
  if (privilege === "admin") {
    router[0].children?.push(settingRRouter);
  }
  return useRoutes(router);
};

export default inject("store")(observer(App));
